import React from 'react'
import { View } from '@tarojs/components'
import cls from 'classnames'

import './index.scss'

export interface IDividerProps {
    dashed?: boolean
    hairline?: boolean
    contentPosition?: string
    fontSize?: number
    borderColor?: string
    textColor?: string
    customStyle?: React.CSSProperties
}

export const Divider: React.FC<IDividerProps> =
    ({
        contentPosition = 'center',
        borderColor = `rgba(0,0,0, 0.5)`,
        textColor = '#262628',
        fontSize,
        ...rest }) => {

        return (
            <View className={cls("xxm-divider-ls", {
                'xxm-divider-ls--dashed': rest.dashed,
                'xxm-divider-ls--hairline': rest.hairline,
            }, `xxm-divider-ls--${contentPosition}`)}
                style={{ ...rest.customStyle, borderColor, color: textColor, fontSize }}
            >
                {rest.children}
            </View>
        )
    }